import React, { Component } from 'react'
import {
  Form,
  Input,
  Button,
  Toast,
} from 'antd-mobile'
import style from "./index.module.scss"
import { UserLoginApi } from "@/api/user.js";
export default class index extends Component {
  // 点击登录按钮
  onLogin = (value) => {
    console.log(value);
    this.UserRegister(value.username,value.password)
  }
  async UserRegister(username,password){
    let res=await UserLoginApi({
      phone:username,
      pass:password
    })
    console.log("登录",res.data);
    if (res.data.code===200) {
      Toast.show({
        content: res.data.msg,
        position: 'bottom',
      })
      sessionStorage.setItem('user-token',res.data.token)
      sessionStorage.setItem('user-msg',JSON.stringify(res.data.userinfo))
      this.props.history.push('/Home')
    }
  }
  // 点击注册按钮
  onRegister = () => {
    this.props.history.push('/Register');
  }
  render() {
    return (
      <div className={style.login}>
        <div className={style.loginpage}>
          <div></div>
          <h1>用户登录</h1>
        </div>
        <Form onFinish={this.onLogin}
          footer={
            <Button block type='submit' color='primary' size='large'>
              立即登录
            </Button>
          }>
          <Form.Item
            name='username'
            label='账号'
            rules={[{ required: true, message: '账号不能为空' }]}
          >
            <Input placeholder='请输入账号' />
          </Form.Item>
          <Form.Item name='password' label='密码' rules={[{ required: true, message: '密码不能为空' }]}>
            <Input placeholder='请输入密码' />
          </Form.Item>
        </Form>
        <Form
          className={style.inp}
          onFinish={this.onRegister}
          footer={
            <Button block type='submit' color='primary' size='large'>
              用户注册
            </Button>
          }
        ></Form>
      </div>
    )
  }
}
